.button {
  display: inline-block;
  vertical-align: top;

  cursor: default;

  height: 24px;
  border-radius: 4px;
  background-color: #b6b6b6;
  padding: 0 13px;
  min-width: 72px;

  &:hover {
    background-color: #a3a3a3;
  }

  &:active {
    background-color: #919191;
  }

  &.disabled {
    cursor: not-allowed;

    &.blue {
      background-color: #14a6c7 !important;
    }

    &:not(.blue) {
      background-color: #b6b6b6 !important;
    }
  }

  &.small {
    min-width: auto;
    height: 20px;
    padding: 0 10px;

    p {
      font-size: 10px;
      line-height: 19px;
    }
  }

  &.blue {
    background-color: #14a6c7;

    &:hover {
      background-color: #1191ad;
    }

    &:active {
      background-color: #0f7b94;
    }

    p {
      font-weight: 600;
    }
  }

  p {
    font-size: 12px;
    color: #fff;
    line-height: 23px;
    text-align: center;
    font-weight: 500;
  }
}
